import React from 'react'
import './AllGoods.less'
import '../../Home.less'

function AllGoods(props) {
    let {n,allList,changeN} = props
    let arr = ["综合推荐", "销量", "好评度", "店铺"]
    return (
        <div>
            <div>
                <div className="allgoods">
                    <div className="gooods_show">
                        {
                            arr.map((item, index) => {
                                return (
                                    <div key={item} className={index === n ? "select" : ""} onClick={()=>changeN(index)} >{item}</div> 
                                )
                            })
                        }
                    </div>
                    <div className="allgoods_show">
                            {
                                allList.map((item, index) => {
                                    return (
                                        <div key={item.id} className="goods_list" onClick={()=>props.history.push('/detail/'+item.id + '/1')}>
                                            <div className="left">
                                                <img src={item.img} alt="" />
                                            </div>
                                            <div className="right">
                                                <p>{item.goodsname}</p>
                                                <p>￥{item.price}元</p>
                                                <del>原价：{item.market_price}元</del>
                                            </div>

                                        </div>
                                    )
                                })
                            }

                        </div>
                </div>
            </div>

        </div>
    )
}

export default React.memo(AllGoods)
